<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="css/mui.min.css" rel="stylesheet" />
		<link href="css/answer.css" rel="stylesheet" />
	</head>

	<body onload="errorQuestionView()">
		<script src="js/mui.min.js"></script>
		<script type="text/javascript">
			mui.init()
		</script>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 id="title" class="mui-title" style="color: red;"></h1>
		</header>
		<div class="answer-question answer-background-color">
			<div id="error-question-view" class="error-question-view">
				
			</div>
			<div class="submit-answer">
				<ul class="submit_error_ul">
						<li><button id="submit_back_parent" class="mui-btn mui-btn-success">返回上一级</button></li>
						<li><button id="submit_back_subject" class="mui-btn mui-btn-warning once-again">返回到科目</button></li>
				</ul>
			</div>
		</div>
		<!--
        	作者：2524031199@qq.com
        	时间：2018-05-03
        	描述：返回上一级以及返回到科目的监听事件
        -->
        <script>
        	document.getElementById("submit_back_parent").addEventListener("click",function(){
        		mui.openWindow({
        			url:"review_of_error.html",
        			id:"review_of_error.html"
        		});
        	});
        	
        	
        	mui(".submit-answer").on("tap","#submit_back_subject",function(){
        		mui.openWindow({
        			url:"html/subjets.html",
        			id:"html/subjets.html",
        		})
        	})
        </script>
		
		<!--
        	作者：offline
        	时间：2018-04-25
        	描述：引入自己定义的IP地址
        -->
			<script src="js/ip.js"></script>
		<!--
        	作者：offline
        	时间：2018-05-01
        	描述：详细错题页面显示，根据TPID 查询，并渲染即可。
        -->
		<script>
				function errorQuestionView(){
				/*
				 * mui.ajax获取后台数据，拼接html渲染到页面上
				 */
				var tpName = localStorage.getItem("tpName");
				var tpID = localStorage.getItem('tpId');
				var errorQuestionListViewHttpUrl = 'http://127.0.0.1:8080/errorQuestionListView';
				mui.ajax(errorQuestionListViewHttpUrl,{
					type:"post",
					data:{
						/*
						 * 用户选择查看的错题回顾试卷，将tpId传值过来
						 */
						tpId:tpID
					},
					success:function(data){
						var error_question_html = "";
						console.log(data.ueAnswerList.length);
						console.log(data.userErrorQuestionList.length);
						for(var k=0;k<data.userErrorQuestionList.length;k++){
							var answer = data.userErrorQuestionList[k].qAnswer.split("，");
							var answer_html = "";
							for(var i=0;i<answer.length;i++){
								answer_html += '<li><span>'+answer[i]+'</span></li>';
							}
							error_question_html = '<div id="question" class="question">&nbsp;&nbsp;<span class="title">'+
							'<img style="margin-top:-5px;" src="images/error-page-finger.png"/>&nbsp;&nbsp;&nbsp;第'+data.userErrorQuestionList[k].qOrder+'题：'+'</span>';
							error_question_html+=	'<span class="stem">'+data.userErrorQuestionList[k].qName+'</span>';				
							error_question_html+= '<span>&#40</span>&nbsp;</span><span>&#41</span>';
							error_question_html+= '<ul class="ul-question">';
							error_question_html+= answer_html;
							error_question_html+= '<li><span style="color:#A2CD5A;font-size:16px;">'+"正确答案:"+data.userErrorQuestionList[k].qAnswerTrue+
							'</span></li><li><span style="color:#B03060;font-size:16px;">'+"你的答案:"+data.ueAnswerList[k]+'</span></li></ul></div>';
							document.getElementById("error-question-view").innerHTML += error_question_html;
						}
					}
				});
				document.getElementById("title").innerText = tpName;
				localStorage.removeItem("tpId");
				localStorage.removeItem("tpName");
			}
				</script>
		
		
		<nav class="mui-bar mui-bar-tab">
			<a class="mui-tab-item mui-active" href="#index">
				<span class="mui-icon mui-icon-home"></span>
				<span class="mui-tab-label">首页</span>
			</a>
			<a class="mui-tab-item" href="#tabbar-with-chat">
				<span class="mui-icon mui-icon-email"><span class="mui-badge">9</span></span>
				<span class="mui-tab-label">消息</span>
			</a>
			<a class="mui-tab-item" href="#tabbar-with-contact">
				<span class="mui-icon mui-icon-help"></span>
				<span class="mui-tab-label">关于我们</span>
			</a>
			<a class="mui-tab-item" href="#tabbar-with-map">
				<span class="mui-icon mui-icon-contact"></span>
				<span class="mui-tab-label">我的</span>
			</a>
		</nav>
	</body>
</html>